import { useState, useEffect } from 'react'
import PanelLeft from '../../../../../common/PanelLeft';
import BlockTitle from '../../../../../framework/BlockTitle';
import { resourcePath } from '../../../../../../utils/resource';
import BasicTable from '../FloodWarning/BasicTable';
import MapPointerMove from '../common/MapPointerMove';
import RcxDetail from './RcxDetail';
import useMap from '../hooks/useMap';
import Legend from '../common/Legend';
import BlockPanel from '../common/BlockPanel';
import RcxTable from './RcxTable';
import LwtDetail from './LwtDetail';
import LqkkDetail from './LqkkDetail';
import Yujinmsg from '../Yujinmsg';
const fields = ['zdm', 'installPosition'];
export default function FireWarning(props) {
    const map = useMap();

    useEffect(() => {
        if (map) {
            setTimeout(() => {
                // map.dispatchEvent({
                //     type: 'fixed.item.show',
                //     title: '降雨量',
                //     component: <RainTable />
                // })
                map.dispatchEvent({
                    type: 'fixed.item.show',
                    title: '火灾',
                    component: <Yujinmsg activeKey={'火灾'} />
                })
            }, 100);
        }
    }, [map])
    return <>
        <PanelLeft className="layout-v" style={{
            // top: 98
        }}>
            <RcxTable
                title="热成像云台"
                mapScale={resourcePath.scales.yghd_blue_scale}
                mapIcon={resourcePath.mapIcons[`yghd_blue`]}
                onDetail={(item, feature) => {
                    map.dispatchEvent({
                        type: 'detail.show',
                        title: item.installPosition,
                        component: <RcxDetail item={item} />,
                        feature: feature
                    })
                }}
            />
            <BasicTable
                jcdlx={"高空瞭望塔"}
                title="高空瞭望塔"
                mapScale={resourcePath.scales.gk_blue_scale}
                mapIcon={resourcePath.mapIcons[`gk_blue`]}
                onDetail={item => {
                    map.dispatchEvent({
                        type: 'detail.show',
                        title: item.zdm,
                        component: <LwtDetail item={item} />
                    })
                }}
            />
            <BasicTable
                jcdlx={"林区卡口"}
                title="林区卡口监测"
                mapScale={resourcePath.scales.lqka_blue_scale}
                mapIcon={resourcePath.mapIcons[`lqka_blue`]}
                onDetail={item => {
                    map.dispatchEvent({
                        type: 'detail.show',
                        title: item.zdm,
                        component: <LqkkDetail item={item} />
                    })
                }}
            />
        </PanelLeft>

        <Legend />
        <MapPointerMove field={fields} />
    </>;
}